<header class="flex mb-6 items-center">
  <div>
    <h1 class="crayons-title">#<%= @tag.accessible_name %></h2>
    <p>Tagged <%= @tag.taggings_count %> times</p>
  </div>

  <div class="ml-auto">
    <a href="<%= URL.tag(@tag) %>" class="crayons-btn crayons-btn--outlined" target="_blank" rel="noopener noreferer">View</a>
  </div>
</header>

<div class="grid gap-6">
  <div class="crayons-card p-6">
    <h2 class="crayons-subtitle-1">Moderators</h2>
    <div class="flex flex-col gap-2">
      <%= form_with url: admin_tag_moderator_path(@tag.id), model: [:admin, @tag], method: :post, local: true do |f| %>
        <div class="crayons-field w-50 my-4">
          <%= f.label :username, "Add Moderator:", class: "crayons-field__label" %>
          <div>
            <%= f.text_field :username, class: "crayons-textfield js-username_input", placeholder: "username" %>
          </div>
          <%= f.submit "Add Moderator", class: "crayons-btn" %>
        </div>
      <% end %>
      <% if @tag_moderators.exists? %>
        <ul class="list-none">
          <% @tag_moderators.each do |user| %>
              <li class="flex justify-between mb-2">
                <a href="<%= URL.user(user) %>" target="_blank" rel="noopener noreferer">@<%= user.username %></a>
                <%= form_with url: admin_tag_moderator_path(@tag.id), model: [:admin, @tag], method: :delete, local: true do |f| %>
                  <%= f.hidden_field :user_id, value: user.id %>
                  <%= f.submit "Remove", class: "crayons-btn crayons-btn--danger crayons-btn--s" %>
                <% end %>
              </li>
          <% end %>
        </ul>
      <% else %>
        <div class="crayons-notice p-0 mt-1 mb-5" aria-live="polite">
          This tag currently has no moderators.
        </div>
      <% end %>
    </div>
  </div>

  <div class="crayons-card crayons-card--content-rows">
    <h2 class="crayons-subtitle-1">Edit details</h2>
    <%= render "form", tag: @tag, badges_for_options: @badges_for_options %>
  </div>
</div>

<%= javascript_include_tag "admin/convertUserIdsToUsernameInputs" %>
